<template>
	<view class="conten">
		<u-popup 
			:show="VipBuyShow" 
			@close="VipBuyShow = false"
			mode="center"
			bgColor="transparent"
		>
			<view class="backe_page">
				<view class="title_box">
					<image class="imge_s" src="../../static/img/daoqi.png" ></image>
				</view>
				<view class="conte_sondd">
					<view class="vio_texs">请先购买计划服务或使用成长卡激活才能享受</view>
					<view class="button_a" @click="gotopage('jiarujiahua')">购买计划服务</view>
					<view class="button_b" @click="gotopage('chengzhangka')">使用成长卡</view>
					<view class="button_c" @click="gotopage('liaojilianhequnme')">了解联合群美</view>
				</view>
				
				<view class="icond" @click="VipBuyShow = false">
					<u-icon name="close-circle" color="#ffffff" size="28" ></u-icon>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		name: 'ZnDaoqi',
		data(){
			return{
				VipBuyShow: true,
			}
		},
		onLoad(){
			
		},
		methods:{
			gotopage(param){
				if(param == 'jiarujiahua'){
					uni.navigateTo({
						url:'/pages/zhunxingfuwu/jiarujiahua/jiarujiahua'	// 加入计划
					});
				}
				if(param == 'chengzhangka'){
					uni.navigateTo({
						url:'/pages/chengzhangka/chengzhangka'	// 成长卡
					});
				}
				if(param == 'liaojilianhequnme'){
					uni.navigateTo({
						url:'/pages/fuwenb/fuwenb?id=' + 5,
					})
				}
			}
		}
	}
</script>

<style>
	.backe_page{
		position: relative;
		display: flex;
		justify-content: center;
		flex-direction: column;
		align-items: center;
	}
	.title_box{
		z-index: 11;
		width: 614upx;
		height: 354upx;
	}
	.imge_s{
		z-index: 11;
		width: 614upx;
		height: 354upx;
	}
	.conte_sondd{
		width: 614upx;
		position: relative;
		top: -70upx;
		background-color: #FFFFFF;
		padding: 0 56upx 44upx 56upx;
		box-sizing: border-box;
	}
	.vio_texs{
		margin-top: 120upx;
		width: 470upx;
		height: 88upx;
		font-size: 32upx;
		font-family: PingFangHK-Medium, PingFangHK;
		font-weight: 500;
		color: #333333;
		line-height: 44upx;
		display: flex;
		justify-content: center;
		text-align: center;
	}
	.button_a{
		width: 500upx;
		line-height: 90upx;
		background: linear-gradient(226deg, #41474B 0%, #282D30 100%);
		border-radius: 8upx;
		
		display: flex;
		justify-content: center;
		align-items: center;
		
		color: #FFE0C7;
		margin-top: 36upx;
		
		font-size: 32upx;
		font-family: PingFangHK-Regular, PingFangHK;
		font-weight: 400;
	}
	.button_b{
		width: 500upx;
		line-height: 90upx;
		background: #6EC5FF;
		border-radius: 8upx;
		color: #fff;
		margin-top: 24upx;
		
		font-size: 32upx;
		font-family: PingFangHK-Medium, PingFangHK;
		font-weight: 500;
		color: #FFFFFF;
		
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.button_c{
		width: 500upx;
		line-height: 90upx;
		border-radius: 8upx;
		border: 2upx solid #979797;
		
		font-size: 32upx;
		font-family: PingFangHK-Medium, PingFangHK;
		font-weight: 500;
		color: #3C4245;
		
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 24upx;
	}
</style>
